<template>
  <div class="config-sidebar">
    <div class="side-scroll" style="height: calc(100vh - 52px);">
      <scrollBar :topFlag="topFlag">
        <el-menu v-if="isHaveMenu('nav_config')" class="el-menu-vertical-demo sidebar-menu" :default-openeds="openArray">
          <div v-if="isHaveMenu('company_identity')" class="el-menu__first">
            <router-link to="/index/config/accountConfig">
              <el-menu-item index="1">
                <span slot="title">账户信息</span>
              </el-menu-item>
            </router-link>
          </div>
          <div v-if="isHaveMenu('agent_operate_log')" class="el-menu__first">
            <router-link to="/index/config/operateLogManage">
              <el-menu-item index="2">
                <span slot="title">客服操作日志</span>
              </el-menu-item>
            </router-link>
          </div>
          <!-- <div v-if="isHaveMenu('simple_account_config')" class="el-menu__first">
            <router-link to="/index/config/safetyConfig">
              <el-menu-item index="3">
                <span slot="title">登录安全设置</span>
              </el-menu-item>
            </router-link>
          </div> -->
          <el-submenu v-if="isHaveMenu('agent_config')" index="9">
            <template slot="title">
              <span slot="title">座席管理</span>
            </template>
            <router-link to="/index/config/deptAndAgentConfig"><el-menu-item v-if="isHaveMenu('add_agent')" index="4-2">座席列表</el-menu-item></router-link>
            <router-link to="/index/config/agentCallManage" v-if="isHaveMenu('agent_management')">
              <el-menu-item index="14">
                <span slot="title">添加座席</span>
              </el-menu-item>
            </router-link>
          </el-submenu>
          <el-submenu v-if="isHaveMenu('channel_skill_group')" index="4">
            <template slot="title">
              <span slot="title">技能组管理</span>
            </template>
            <router-link to="/index/config/webchatQueueConfig"><el-menu-item v-if="isHaveMenu('channel_webchat')" index="4-2">在线技能组</el-menu-item></router-link>
          </el-submenu>
          <el-submenu v-if="isHaveMenu('online_joinin')" index="5">
            <template slot="title">
              <span slot="title">在线渠道接入</span>
            </template>
            <router-link to="/index/config/webCustomerService"><el-menu-item v-if="isHaveMenu('insert_config')" index="5-3">接入配置</el-menu-item></router-link>
          </el-submenu>
          <el-submenu v-if="isHaveMenu('website_global_config')" index="6">
            <template slot="title">
              <span slot="title">在线服务设置</span>
            </template>
            <router-link to="/index/config/satisfied"><el-menu-item v-if="isHaveMenu('website_satisfaction_config')" index="6-1">满意度设置</el-menu-item></router-link>
            <router-link to="/index/config/webchatEndSession"><el-menu-item v-if="isHaveMenu('finish_webchat_config')" index="6-2">会话结束类型设置</el-menu-item></router-link>
            <router-link to="/index/config/quickReplyMain"><el-menu-item v-if="isHaveMenu('public_quick_reply_config')" index="6-3">公共快捷回复设置</el-menu-item></router-link>
            <router-link to="/index/config/forbiddenChatCue"><el-menu-item v-if="isHaveMenu('not_consultation_config')" index="6-4">禁止咨询设置</el-menu-item></router-link>
            <router-link to="/index/config/onlineVisitorConfig"><el-menu-item v-if="isHaveMenu('webchat_guest_config')" index="6-5">在线咨询访客端设置</el-menu-item></router-link>
            <router-link to="/index/config/onlineAgentConfig"><el-menu-item v-if="isHaveMenu('webchat_seat_config')" index="6-6">在线咨询座席端设置</el-menu-item></router-link>
            <router-link to="/index/config/webchatStatus"><el-menu-item index="6-7">在线咨询自定义状态设置</el-menu-item></router-link>
          </el-submenu>
          <div v-if="isHaveMenu('webchat_blacklist_config')" class="el-menu__first">
            <router-link to="/index/config/blackList">
              <el-menu-item index="7">
                <span slot="title">在线黑名单管理</span>
              </el-menu-item>
            </router-link>
          </div>
          <el-submenu v-if="isHaveMenu('customer_config')" index="11">
            <template slot="title">
              <span slot="title">客户设置</span>
            </template>
            <router-link to="/index/config/customerConfig/modal"><el-menu-item v-if="isHaveMenu('customer_status')" index="6-1">客户模版</el-menu-item></router-link>
            <router-link to="/index/config/customerConfig/import"><el-menu-item v-if="isHaveMenu('customer_import')" index="6-2">客户导入</el-menu-item></router-link>
          </el-submenu>
          <el-submenu v-if="isHaveMenu('config_interface')" index="12">
            <template slot="title">
              <span slot="title">对接设置</span>
            </template>
            <router-link to="/index/config/interfaceConfig/indexUrl"><el-menu-item v-if="isHaveMenu('home_page_interface')" index="6-1">首页对接</el-menu-item></router-link>
            <router-link to="/index/config/interfaceConfig/tabUrl"><el-menu-item v-if="isHaveMenu('customer_tab_interface')" index="6-2">客户TAB页对接</el-menu-item></router-link>
            <router-link to="/index/config/interfaceConfig/allUrlConfig"><el-menu-item v-if="isHaveMenu('global_config_interface')" index="6-3">对接全局设置</el-menu-item></router-link>
          </el-submenu>
          <div v-if="isHaveMenu('dic_config')" class="el-menu__first">
            <router-link to="/index/config/dicConfig">
              <el-menu-item index="10">
                <span slot="title">字典设置</span>
              </el-menu-item>
            </router-link>
          </div>
          <div v-if="isHaveMenu('system_notice')" class="el-menu__first">
            <router-link to="/index/config/noticeConfig">
              <el-menu-item index="10">
                <span slot="title">公告管理</span>
              </el-menu-item>
            </router-link>
          </div>
          <div v-if="$store.state.session.user.isAdmin" class="el-menu__first">
            <router-link to="/index/config/roleConfig">
              <el-menu-item index="13">
                <span slot="title">角色配置</span>
              </el-menu-item>
            </router-link>
          </div>
        </el-menu>
      </scrollBar>
    </div>
  </div>
</template>
<script>
  import {isHasMenu} from '@/utils/m7Utils'
  import scrollBar from '@/components/ui-modules/ScrollBar'
  export default {
    name: 'Sidebar',
    data () {
      return {
        openArray: ['4', '5', '6', '8', '10', '11', '12'],
        topFlag: true,
        isCollapse: true,
      }
    },
    activated () {
      console.log('activated')
      console.log(this.$route)
      this.$store.dispatch('getNewFeatures')
    },
    methods: {
      backOld () {
        window._hmt && window._hmt.push(['_trackEvent', '其他统计', 'PM-回到旧版设置'])
      },
      isHaveMenu (func) {
        let user = this.$store.state.session.user
        // 只有超级管理员可见得通话配置id
        let AdminShowArr = ['simple_pbx_basic_information', 'simple_sip_management', 'simple_outgoing_call_circuit_congiguration', 'simple_variable_management', 'simple_explicit_number_group_management', 'simple_seat_management']
        if (AdminShowArr.includes(func)) {
          return user.type === 'admin' && user.exten === '0000'
        } else {
          return isHasMenu(func, user)
        }
      }
    },
    components: {
      scrollBar
    }
  }
</script>
<style lang="stylus">
  @import "../../../../assets/common.styl"
  .config-sidebar
    .router-link-active
      li
        color $c-main !important
        background-color #dddee0 !important
</style>
<style lang="stylus">
  @import "../../../../assets/common.styl"
  .merchant-config
    .config-sidebar
      text-align left
      position relative
      .side-scroll
        height calc(100vh - 52px)
      .el-menu
        background-color #f0f2f3
      .sidebar__title
        color #a0a9ad
        padding 10px 0
        border-bottom 1px solid #444c4f
      .el-menu__first
        font-weight bold
      .el-submenu
        .el-menu
          .el-menu-item
            padding-left 20px !important
          .el-menu-item:hover,.el-menu-item:focus
            color $c-main
            background-color #dddee0
      .sidebar-menu > .el-menu__first a li
        padding 15px 0px
        color $cf-gray0
      .sidebar-menu > .el-submenu
        color $cf-gray0
      .sidebar-menu .el-submenu li
        font-weight normal
        color #424242
      .sidebar-menu
        padding-top 5px
        margin-bottom 54px
      .el-menu-item
        height 45px
        line-height 14px
      .el-submenu__title
        height 44px
        line-height 44px
        font-weight bold
        color #000
       .el-submenu__title:hover,.el-submenu__title:focus
         color $c-main
         background-color #dddee0
       .el-submenu .el-menu .el-menu-item
         padding: 8px 0px;
         min-width: 100%;
         height: 30px;
       .config-sidebar__bottom
         position: absolute;
         width: 100%;
         height: 54px;
         bottom: 0px;
         z-index 2;
         background-color: #f5f6f7;
         border-top: 1px solid #e0e0e0;
         box-shadow: 0px -4px 6px -4px rgba(128,128,128,0.2);
         .config-sidebar__bottom-a
           background-color: #459ae9;
           color: #fff;
           border-radius: 4px;
           padding: 3px 7px;
        .el-menu-item:hover, .el-menu-item:focus
          color $c-main !important
          background-color #dddee0
          font-weight bold
</style>
